<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>汽车购票系统</title>
    <link rel="stylesheet" href="./constom/css/frozen.css">
    <link rel="shortcut icon" href="./constom/img/carTitlePicture.jpg"/>
    <style>
        .box{
            margin-top: 0.2rem;
        }
        .box div{
            border-top: 1px solid rgba(128, 128, 128, 0.51);
            border-bottom: 1px solid rgba(128, 128, 128, 0.51);
        }
        .buttonFriends{
            margin-top: 0.5rem;
        }
        .ui-poptips{
            width: 100vw;
            height: 40vh;
            position: fixed;
            right: 0;
            bottom: 0;
            margin: auto;
            display: none;
        }
    </style>
</head>
<body ontouchstart="">
<header class="ui-header ui-header-positive  ">
        <h1 style="font-size: 0.3rem">登录</h1>
</header>
<footer class="ui-footer ui-footer-btn">
    <ul class="ui-tiled ui-border-t">
        <li data-href="index.html" class="ui-border-r"><div>车票预订</div></li>
        <li data-href="ui.html" class="ui-border-r"><div>订单查询</div></li>
        <li data-href="js.html" style="background-color: #18B4ED"><div style="color: #fffefe">我的信息</div></li>
    </ul>
</footer>
<section class="ui-container">
    <!--用户，密码输入框-->
    <div class="ui-form ui-border-t box">
        <form action="#">
            <div class="ui-form-item ui-form-item-show ui-border-b">
                <label for="userName">用户</label>
                <input type="text" value="" id="userName">
            </div>
            <div class="ui-form-item ui-form-item-show ui-border-b" style="border-top: none">
                <label for="Password">密码</label>
                <input type="password" value="" id="Password">
            </div>
        </form>
    </div>
    <!--注册登录按钮-->
    <div class="ui-btn-group buttonFriends">
        <button class="ui-btn-lg ui-btn-primary gotoRegister">
            注册
        </button>
        <button class="ui-btn-lg ui-btn-primary myLogin">
            登录
        </button>
    </div>
    <!--提示框-->
    <div class="ui-poptips ui-poptips-warn closeTip">
        <div class="ui-poptips-cnt"><i></i>温馨提示</div>
        <div class="ui-poptips-cnt" style="text-align: left"><span id="tipSection">请输入用户名</span></div>
        <div class="ui-poptips-cnt"><button class="ui-btn">确定</button></div>
    </div>

</section>
</section>
<script src="./constom/lib/zepto.main.1.20.js"></script>
<script src="./constom/js/frozen.js"></script>
<script src="./constom/lib/NEWzepto.tocuh.js"></script>
<script>
    var myLogin=$(".myLogin"),gotoRegister=$('.gotoRegister'),closeTip=$('.closeTip');
    //    登录
    myLogin.on('tap',function(){
        console.log(123);
        var name=$('#userName').val(),password=$('#Password').val();
        var obj={
            name:name,
            password:password
        };
        if(name==''||name==null||name==undefined){
            $('#tipSection').text("请输入用户名");
            $('.ui-poptips').show();
            return false;
        }
        if(password==''||password==null||password==undefined){
            $('#tipSection').text("请输入密码");
            $('.ui-poptips').show();
            return false;
        }
        $.ajax({
            type:"post",
            data:obj,
            url:"/loading",
            success:function(data){
                if(data=="error"){
                    $('#tipSection').text("用户名和密码不正确");
                    $('.ui-poptips').show();
                    return false;
                }
                if(data=="ok"){
                    createlocalStorage({minute:500},'nameQQ',name);
                    createlocalStorage({minute:500},'pawQQ',password);
                    location.href = "./constom/html/ticketBooking.html";
                }
            }
        });
    });

    //关闭提示框
    closeTip.on('tap',function(){
        $('.ui-poptips').hide();
    });

    //跳转注册页面
    gotoRegister.on('tap',function(){
        location.href = "./constom/html/register.html";
    });




    //    ---------------------------------------保存登陆状态--------------------------
    //每一次刷新 都要执行的函数
    uploadlocalStorage();


    //--------------------------声明--------------------------


    function uploadlocalStorage(){
        YesNolocalStorageDelete('nameQQ');
        YesNolocalStorageDelete('pawQQ');
    }


    function YesNolocalStorageDelete(mydata){
        var datat  = new  Date(),
                dataSJC =  datat.getTime();
//        当存在没有localStorage.Myexpires的情况
        if(localStorage.Myexpires == undefined || localStorage.Myexpires == 'undefined'){
            localStorage.Myexpires = 0;
        }
//        判断是否超出 预期时间
        if(parseInt(localStorage.Myexpires) > dataSJC){
            console.log("没有过期");
            $('#userName').val(localStorage.nameQQ);
            $('#Password').val(localStorage.pawQQ);
        }else{
            console.log("过期了");
            localStorage.removeItem(mydata);
        }
    }


    //        设置，声明我的localStorage
    function createlocalStorage(data,jsonattr,jsonvula){
        if(data.day == undefined && data.hour == undefined &&
                data.minute == undefined && data.second == undefined){
            console.log("大哥，请你输入在 实参里 输入day or hour or minute  or second对象值")
        }else{
            var d=0, h=0, m=0, s=0;
            if(data.day != undefined){
                d = data.day;
            }
            if(data.hour != undefined){
                h = data.hour;
            }
            if(data.minute != undefined){
                m = data.minute;
            }
            if(data.second != undefined){
                s = data.second;
            }
            var datat  = new  Date();
            var dataSJC =  datat.getTime()+( (d*24*60*60*1000) + (h*60*60*1000) + (m*60*1000) + (s*1000) );
            //存放 时间戳
            localStorage.Myexpires = dataSJC;
            localStorage.setItem(jsonattr,jsonvula);
        }
    }
</script>
</body>
</html>